<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<% 
	String appPath = request.getContextPath();
%>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Admin System</title>

	<link type="text/css" href="<%=appPath%>/page/style.css" rel="stylesheet" /> <!-- the layout css file -->
	<link type="text/css" href="<%=appPath%>/page/css/jquery.cleditor.css" rel="stylesheet" />
	
	<script type="text/javascript" src="<%=appPath%>/page/jslib/jQuery/jquery-1.7.2.min.js"></script>
	<script type="text/javascript" src="<%=appPath%>/page/jslib/jquery-ui-1.8.21/js/jquery-ui-1.8.21.custom.min.js"></script>
	<script type='text/javascript' src='<%=appPath%>/page/js/cufon-yui.js'></script> <!-- Cufon font replacement -->
	<script type='text/javascript' src='<%=appPath%>/page/js/ColaborateLight_400.font.js'></script> <!-- the Colaborate Light font -->
	<script type='text/javascript' src='<%=appPath%>/page/js/easyTooltip.js'></script> <!-- element tooltips -->
	<script type='text/javascript' src='<%=appPath%>/page/js/jquery.tablesorter.min.js'></script> <!-- tablesorter -->
	<script type='text/javascript' src='<%=appPath%>/page/js/visualize.jQuery.js'></script> <!-- visualize plugin for graphs / statistics -->
	<script type='text/javascript' src='<%=appPath%>/page/js/iphone-style-checkboxes.js'></script> <!-- iphone like checkboxes -->
	<script type='text/javascript' src='<%=appPath%>/page/js/jquery.cleditor.min.js'></script> <!-- wysiwyg editor -->
	<script type='text/javascript' src='<%=appPath%>/page/js/custom.js'></script> <!-- the "make them work" script -->
	
	<!--[if IE 8]>
		<script type='text/javascript' src='js/excanvas.js'></script>
		<link rel="stylesheet" href="css/IEfix.css" type="text/css" media="screen" />
	<![endif]--> 
 
	<!--[if IE 7]>
		<script type='text/javascript' src='js/excanvas.js'></script>
		<link rel="stylesheet" href="css/IEfix.css" type="text/css" media="screen" />
	<![endif]--> 
	
</head>

<body>

	<div id="container">
		<div >
			<div id="primary_right">
				<div class="inner">

					<h1>Tables, Sortable Tables, Paginators</h1>

					<table class="normal tablesorter">
						<thead>
							<tr>
								<th>Select</th>
								<th>No</th>
								<th>User Image</th>
								<th>Full Name</th>
								<th>Subscription type</th>
								<th>Joined date</th>
								<th>Actions</th>
							</tr>
						</thead>
						<tbody>
							<tr class="odd">
								<td><input type="checkbox" class="iphone" /></td>
								<td>211</td>
								<td><img src="<%=appPath%>/page/assets/avatar.png" alt="" /></td>
								<td>Johnatan Doe</td>
								<td>6 months membership</td>
								<td>09-12-2011</td>
								<td>
									<a href="#" title="Edit this user" class="tooltip table_icon"><img src="<%=appPath%>/page/assets/icons/actions_small/Pencil.png" alt="" /></a> 
									<a href="#" title="Preferences" class="tooltip table_icon"><img src="<%=appPath%>/page/assets/icons/actions_small/Preferences.png" alt="" /></a>
									<a href="#" title="Delete this user" class="tooltip table_icon"><img src="<%=appPath%>/page/assets/icons/actions_small/Trash.png" alt="" /></a>
								</td>
							</tr>
							<tr>
								<td><input type="checkbox" checked="checked" class="iphone" /></td>
								<td>107</td>
								<td><img src="<%=appPath%>/page/assets/avatar.png" alt="" /></td>
								<td>Johnatan Doe</td>
								<td>1 month membership</td>
								<td>09-12-2011</td>
								<td>
									<a href="#" title="Edit this user" class="tooltip table_icon"><img src="<%=appPath%>/page/assets/icons/actions_small/Pencil.png" alt="" /></a> 
									<a href="#" title="Preferences" class="tooltip table_icon"><img src="<%=appPath%>/page/assets/icons/actions_small/Preferences.png" alt="" /></a>
									<a href="#" title="Delete this user" class="tooltip table_icon"><img src="<%=appPath%>/page/assets/icons/actions_small/Trash.png" alt="" /></a>
								</td>
							</tr>
							<tr class="odd">
								<td><input type="checkbox" class="iphone" /></td>
								<td>34</td>
								<td><img src="<%=appPath%>/page/assets/avatar.png" alt="" /></td>
								<td>Johnatan Doe</td>
								<td>9 months membership</td>
								<td>09-12-2011</td>
								<td>
									<a href="#" title="Edit this user" class="tooltip table_icon"><img src="<%=appPath%>/page/assets/icons/actions_small/Pencil.png" alt="" /></a> 
									<a href="#" title="Preferences" class="tooltip table_icon"><img src="<%=appPath%>/page/assets/icons/actions_small/Preferences.png" alt="" /></a>
									<a href="#" title="Delete this user" class="tooltip table_icon"><img src="<%=appPath%>/page/assets/icons/actions_small/Trash.png" alt="" /></a>
								</td>
							</tr>
							<tr>
								<td><input type="checkbox" class="iphone" /></td>
								<td>48</td>
								<td><img src="<%=appPath%>/page/assets/avatar.png" alt="" /></td>
								<td>Johnatan Doe</td>
								<td>3 months membership</td>
								<td>09-12-2011</td>
								<td>
									<a href="#" title="Edit this user" class="tooltip table_icon"><img src="<%=appPath%>/page/assets/icons/actions_small/Pencil.png" alt="" /></a> 
									<a href="#" title="Preferences" class="tooltip table_icon"><img src="<%=appPath%>/page/assets/icons/actions_small/Preferences.png" alt="" /></a>
									<a href="#" title="Delete this user" class="tooltip table_icon"><img src="<%=appPath%>/page/assets/icons/actions_small/Trash.png" alt="" /></a>
								</td>
							</tr>
						</tbody>
					</table>
         
					<hr />
					
				</div> <!-- inner -->
			</div> <!-- primary_right -->
		</div> <!-- bgwrap -->
	</div> <!-- container -->
</body>
</html>
